<script setup>
	import {ref} from 'vue'
const isDel = ref(false)
const onRadio = ()=>{
	isDel.value = !isDel.value

}
</script>

<template>

		<view class="yearwarn">
			<view class="warn-li">
				<view class="li-left"></view>
			<view style="height: 156rpx; display: flex;justify-content: space-between;align-items: center;" class="">
				<view class="warn-text">
					<text :class="{onisdel:isDel}">铲屎</text>
					<text>08:20</text>
				</view>
				<view class="radio">
					<checkbox-group  @change="onRadio">
						<checkbox  color="#000" value="del" />
					</checkbox-group>
					
				</view>
			</view>
			</view>
			
		
		</view>
</template>



<style lang="scss">
.yearwarn{
		width: 690rpx;
		margin:35rpx auto 0 auto;
	
		.warn-li{
			width: 676rpx;
			height: 156rpx;
			border:2px solid black ;
			border-left: 0;
			border-radius: 25rpx;
			background-color: #fff;
			.radio{
				float: right;
				transform: scale(0.7);
			}
			.warn-text{
				display: flex;
				flex-direction: column;
			}
			.li-left{
				width: 20rpx;
				height: 156rpx;
				background-color: #ffeb3b;
				float: left;
				border: 2px solid black;
				border-radius: 20rpx;
				margin-top: -8rpx;
				margin-right: 30rpx;
			}
		}
	}
</style>